در این مطلب میخوام سایتی رو بهتون معرفی کنم که در اون 12 آیکون زیبا مربوط به تعطیلات قرار داده شده و شما میتونین اونا رو بصورت رایگان دانلود کرده و استفاده کنید. برای دانلود این آیکونها بر روی لینک vacation_stuff.ai کلیک کنید. این آیکون ها در فرمت ai هستند و میتونین از اون در Adobe Illustrator استفا

0 350 ۲۹ اسفند ۹۵ در فصل 20 و جلسه 28 که آخرین جلسه این دوره می باشد ، یک پروژه تمرینی برای رشته های طراحی صنعتی و مکانیک خواهیم داشت که ترسیم پلان دو قطعه صنعتی خواهد بود. در این فصل می پرداریم به:ترسیم چند پلان دو بعدی از قطعات صنعتیتوضیحات : اگر به آموزشگاه های تدریس نرم افزاره

0 105 ۲۹ اسفند ۹۵توضیحات : پرداخت درونبرنامهای یا In-App Billing که به اختصار به آن IAP نیز میگوییم، یکی از خدمات ارائه شده توسط بازار است که به شما امکان میدهد یک فروشگاه در برنامه خود راهاندازی کنید و در آن محتویات دیجیتال مورد نظرتان را بفروشید. برای مثال، میتوانید از پرداخت درونبرنامهای

0 22 ۲۷ اسفند ۹۵همونطور که اطلاع دارید در جلسه گذشته موارد مربوط به Media رو به پایان رسوندیم و حالا قصد داریم مواردی رو در مورد Fonts یا فونت ها در اختیارتون قرار بدیم.Fonts یا فونت هاشما چطور فونتها رو لود و استفاده میکنید؟همونطور که میدونید یکی از اجزای هر صفحه وب و رابط کاربری اون فونتها هستن ک

در این مطلب میخوام سایتی رو بهتون معرفی کنم که در اون بصورت کامل و مرحله به مرحله به شما ساخت اشکال پیکسلی در CSS رو آموزش میده و میتونین با استفاده از اون چیزای زیبایی رو به وجود بیارید. همچنین به روشهای دیگه ای هم که میتونین چنین کاری رو انجام بدین، اشاره خواهد شد.برای شروع وارد سایت css-pixel-art

در این قسمت میخوام یک کد ( Google Account Sign In ) جالب رو در اختیارتون بزارم.همونطور که دیدید یک رابط کاربری زیبا برای فرم ورود یا Sign In گوگل قرار داده شده و میتونین از اون استفاده کنید.بدلیل اینکه حجم کدها زیاد بود ، اونارو در انتهای همین مطلب قرار میدم که میتونین اونو دانلود کرده و استفاده کنی

در این قسمت میخوام یک کد ( My Toyota Key ) جالب رو در اختیارتون بزارم.همونطور که دیدید سوئیچ ماشین مربوط به Toyota ساخته شده و چهار دکمه هم قرار داده شده و هر کدام وظایف خودشونو انجام میدن. زمانی که بر روی دکمه های بسته و باز شدن قفل کلیک میکنید، قفل مربوط به ماشین تغییر حالت میده و با کلیک بر روی ک

0 99 ۲۴ اسفند ۹۵در این قسمت و قسمت بعدی در مورد شمارنده ها یا Counter صحبت خواهیم کرد. با استفاده از این ویژگی میتونیم شمارنده رو برای المنتهای مختلف با استفاده از CSS خالص قرار بدیم. برای این موضوع ما از این لینکبه عنوان منبع استفاده میکنیم.همونطور که میدونین نمایش دادن اطلاعات بصورت مناسب یک مزیت

2 105 ۲۶ اسفند ۹۵ در جلسه سوم از فصل سوم دوره آموزشی ایلوستریتور می پردازیم به بررسی تکنیک colorfull-lamp-sketch در این جلسه می پرداریم به : ... پروژه این جلسه :طرح اولیه : طرح نهایی : توضیحات : گرافیک گرافیک گرافیک، واژه ای که روزانه دست کم یک مورد وابسته با آنرا می بین

در این مطلب میخوام سایتی رو بهتون معرفی کنم که در اون مجموعه ای از ابزار و منابع مفید برای React رو بصورت دسته بندی شده قرار داده و شما میتونین از اونا استفاده کنید و سطح خودتون رو بالاتر ببرید.

برای شروع وارد سایت react-components بشین.

امیدوارم بدردتون بخوره.

موفق باشید.

یا علی

0 44 ۲۳ اسفند ۹۵همونطور که میدونید در جلسات قبل در مورد متدهایی که میتونیم با استفاده از اونا مسیرها و اشکال رو تعریف کرده و بر روی Canvas رسم کنیم رو بهتون توضیح دادیم. در این جلسه و جلسات بعد انواع روشهای استایل دهی به اشکال رو بهتون آموزش میدیم. استایلهایی که میتونین از اونا استفاده کنید رو در ز

در این قسمت میخوام یک کد ( Gooey Transition ) جالب رو در اختیارتون بزارم.همونطور که دیدید یک Transition یا انتقال زیبا بصورت چسبنده ساخته شده و میتونین از اون ایده بگیرید و استفاده کنید.بدلیل اینکه حجم کدها زیاد بود ، اونارو در انتهای همین مطلب قرار میدم که میتونین اونو دانلود کرده و استفاده کنید. ا

در این قسمت میخوام یک کد ( Hinged Twitter Button ) جالب رو در اختیارتون بزارم.همونطور که دیدید یک آیکون Twitter قرار داده شده و زمانی که بر روی اون هاور میکنید، با افکت زیبایی و بصورت لولا مانند میچرخه و آی دی Twitter فرد مورد نظر رو نمایش میده و با کلیک بر روی اون به صفحه مربوط به اون فرد در Twitte

در این قسمت میخوام یک کد ( Little Lunar Loader ) جالب رو در اختیارتون بزارم.همونطور که دیدید یک لودر زیبا با ماه و زمین ساخته شده و در اون ماه بصورت مداوم و زیبا به دور زمین میچرخه. میتونین از این نمونه ایده بگیرید و استفاده کنید.بدلیل اینکه حجم کدها زیاد بود ، اونارو در انتهای همین مطلب قرار میدم ک

در این مطلب میخوام سایتی رو بهتون معرفی کنم که به شما آموزش میده که چطور یک رابط کاربری زیبا برای محصولات خودتون در فروشگاه بسازید که کاربران با استفاده از اون بتونن مدلهای مورد نظر خودشون رو در مراحل مختلف انتخاب کنن و در آخر اون رو خریداری کنن.برای شروع وارد سایت product-builder بشین.امیدوارم بدرد

در این قسمت میخوام یک کد ( CSS 3D Alteating Text ) جالب رو در اختیارتون بزارم.همونطور که دیدید یک افکت سه بعدی زیبا برای متن ساخته شده و میتونین از اون در سایتتون استفاده کنید.بدلیل اینکه حجم کدها زیاد بود ، اونارو در انتهای همین مطلب قرار میدم که میتونین اونو دانلود کرده و استفاده کنید. امیدوارم لذت برده باشین.موفق باشید.یا علیSourceنوع کد رايگان

در این قسمت میخوام یک کد ( Experiment with FAB ) جالب رو در اختیارتون بزارم.همونطور که دیدید یک ایده زیبا برای FAB یا Floating Action Button یا دکمه شناور قرار داده شده و زمانی که بر روی اون کلیک میکنید با افکت موجی پخش میشه و کل المنت رو میگیره و با زدن بر روی X به حالت اول بر میگیرده. میتونین از این نمونه در سایتتون استفاده کنید و زیبایی خاصی رو بهش بدین.بدلیل اینکه حجم کدها زیاد بود ، اونارو در انتهای همین مطلب قرار میدم که میتونین اونو دانلود کرده و استفاده کنید. امیدوارم لذت برده باشین.موفق باشید.یا علیSourceنوع کد رايگان

*, *::after, *::before {-webkit-box-sizing:border-box;box-sizing:border-box;}.tilter {display:block;position:relative;width:300px;height:415px;margin:3emauto;color:#fff;perspective:1000px;}.tilter * {pointer-events:none;}.tilter:hover,.tilter:focus {color:#fff;outline:none;}/*.tilter__figure,.tilter__deco,.tilter__caption { will-change: transform;}*/.tilter__figure,.tilter__image {margin:0;width:100%;height:100%;display:block;}.tilter__figure > * {transform:translateZ(0px);/* Force correct stacking order */}.smooth .tilter__figure,.smooth .tilter__deco--overlay,.smooth .tilter__deco--lines,.smooth .tilter__deco--shine div,.smooth .tilter__caption {transition:transform0.2sease-out;}.tilter__figure {position:relative;}.tilter__figure::before {content:'';position:absolute;width:90%;height:90%;top:5%;left:5%;box-shadow:030px20pxrgba(35,32,39,0.5);}.tilter__deco {position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;}.tilter__deco--overlay {background-image:linear-gradien

0 22 ۲۳ بهمن ۹۵ویژگی animation-fill-modeاین ویژگی جالب و حرفه ای مشخص میکنه زمانی که انیمیشن برای المنت مورد نظر اجرا نمیشه، چه استایلی برای اون اعمال بشه. فرض کنید که یک المنت h1 بصورت زیر داریم:و کدهای CSS زیر رو برای اون تعریف کردیم:1234567891011121314@keyframes color {0% {background-color:darkblue;}100% {background-color:green;}}h1 {animation:color2sease;animation-delay:2s;background-color:red;}میبینید که رنگ این المنت رو در ابتدا قرمز در نظر گرفتیم و یک keyframes بنام color ساختیم و رنگ رو از آبی تیره به سبز تبدیل کردیم. این انیمیشن بصورت ease و بمدت دو ثانیه اجرا میشه. ما در این مطلب در همه مثالها از 2 ثانیه Delay استفاده میکنیم تا بتونیم قبل از اجرا شدن انیمیشن رو هم بررسی کنیم و بهتر با مقادیر ویژگی animation-fill-mode آشنا بشیم. اگر اون رو در مرورگر ببینید بصورت زیر هست:همونطور که دیدید در دو ثانیه اول که تاخیر داره، همون قرمز یا مقدار اولیه میمونه و زمانی که انیمیشن شروع میشه، از رنگ آبی به سبز تبدیل میشه و در آخر هم دوباره به مقدار اولیه که همون قرمز هست، برمیگرده. این روند

0 341 ۲۴ بهمن ۹۵ در فصل 18 آموزش هایی کاربردی از قسمت های مختلف اتوکد اعم از دستورات و تنظیمات که با استفاده از آنها تبدیل به کاربری حرفه ای خواهید شد تدریس می شود.در واقع یکی از تفاوت های این دوره با دوره های دیگر آموزش نرم افزار اتوکد این فصل خواهد بود که در چند جلسه ارائه می شود. در این جلسه می پرداریم به:بدست آوردن مساحت چندین چندضلعی با روشی دیگرآشنایی با دستور extrim برای حذف سریع اضافات آبجکت ها در محل تقاطع با یک پلی گونCopy و Move کردن آبجکت ها با استفاده از موس و بدون تایپ دستوررفع مشکل عدم نمایش اندازه گذاری روی هاشوربرش زدن عکس در محیط اتوکدبازکردن انواع فایل در اتوکد با drag & dropتغییر دسته جمعی نام لایه هاBy Layer کردن سریع آبجکت هارفع مشکل سوئیچ کردن بین Viewport ها در Layoutساخت یک Layout و استفاده از آن در پروژه های مختلفتوضیحات : اگر به آموزشگاه های تدریس نرم افزارهای مهندسی سر بزنید ، با هزینه های سرسام آور آموزش این نرم افزارها مواجه خواهید شد. برای مثال دوره ی اتوکد در اکثر آموزشگاه ها هزینه ای بین 600 تا 900 هزارتومان دارد. آن هم در کلاسی 8

0 74 ۲۴ بهمن ۹۵ به نام خدا و سلام. با جلسه آخر از دوره پلاگین نویسی وردپرس در خدمت شما هستیم در این جلسه در مورد امن سازی فرم ها و درخواست های ارسال در وردپرس و هم چنین بحث ارسال درخواست های http از نوع get و post و در نهایت در مورد قابلیت ترجمه در پلاگین های وردپرس صحبت خواهیم کرد. توضیحات : وردپرس به عنوان محبوب ترین سیستم مدیریت محتوا در بین اکثر کاربران فضای مجازی به خوبی شناخته شده است و این موضوع باعث شده تا سیستم های مختلفی برای وردپرس تهیه و به بازار عرضه شود. هر چند وردپرس خود رایگان است اما قابلیت های توسعه آن از جمله قالب ها و پلاگین ها که به کاربران کمک می کند سیستم مورد نظر خود را پیاده سازی کنند، باعث شده است تا رونق بسیار زیادی در بازار فروش قالب ها و پلاگین های آن ایجاد شود. فروش هایی که تا دهها میلیون دلار هم برای یک افزونه می رسد! در این دوره سعی کرده ایم تمامی مواردی که شما برای تهیه یک پلاگین عالی و کاملا حرفه ای نیاز دارد را قرار دهیم و تدریس نماییم. آموزش ها به صورت کاملا پروژه محور و کاربردی تهیه شده است، پلاگین هایی حرفه ا

در این مطلب میخوام سایتی رو بهتون معرفی کنم که بازی زیبا و سر گرم کننده ای رو درون مرورگر در اختیار ما قرار میده و میتونیم از اون استفاده کنیم. برای شروع بر روی دکمه Play کلیک کنید و بازی شروع میشه. با استفاده از دکمه های چپ و راست میتونین جابجا بشید و باید آلات موسیقی رو جمع کنید و متناسب با هر کدام از اونا، موسیقی در پس زمینه اوج میگیره. برای شروع وارد سایت chordsurfer بشین. امیدوارم بدردتون بخوره. موفق باشید. یا علی This article passed through the Full- - , .Recommended article: The Guardian's Summary of Julian Assange's Interview Went Viral and Was Completely False.

در این مطلب میخوام سایتی رو بهتون معرفی کنم که در اون بصورت کامل و مقدماتی در مورد ساخت برنامه با استفاده از ابزارهای React و Redux توضیح داده شده و شما میتونین با مطالعه اون به راحتی برنامه مورد نظر خودتون رو بسازید و از قدرت اونا بهره ببرید. برای شروع وارد سایت build-react-redux بشین. امیدوارم بدردتون بخوره. موفق باشید. یا علی This article passed through the Full- - , .Recommended article: The Guardian's Summary of Julian Assange's Interview Went Viral and Was Completely False.

در این قسمت میخوام یک کد ( Hexagon Blog Header ) جالب رو در اختیارتون بزارم. همونطور که دیدید چارچوب شش ضلعی و زیبایی ساخته شده و زمانی که بر روی اونایی که متن دارن هاور میکنید، بصورت زیبا Scale و بزرگتر میشه. از این استایل میتونین ایده بگیرید و ازش استفاده کنید. بدلیل اینکه حجم کدها زیاد بود ، اونارو در انتهای همین مطلب قرار میدم که میتونین اونو دانلود کرده و استفاده کنید. امیدوارم لذت برده باشین. موفق باشید. یا علی Source نوع کد رايگان This article passed through the Full- - , .Recommended article: The Guardian's Summary of Julian Assange's Interview Went Viral and Was Completely False.

در جلسه سیزدهم دوره آموزش فریم ورک فاندیشن می پرداریم به بررسی بخش دوم مبحث منوها و با کلاس ها و تگ های بیشتری از آن آشنا خواهیم شد...

نکته : دانشجویان عزیز : مباحث این جلسه دارای چندین تکنیک و معرفی چندین اتریبیوت مهم می باشد لذا با دقت این جلسه رو مشاهده نمایید...

در این جلسه می پردازیم به :

• نحوه ایجاد کامل یک منو
• بررسی کلاس top-bar
• بررسی کلاس top-bar-right
• بررسی کلاس top-bar-left
• نحوه ایجاد لینک های منو و فرم ها در محدوده منو
• نحوه واکنشگرا کردن منون
• بررسی کلاس top-bar-title
• بررسی اتریبیوت data-responsive-toggle و کاربرد آن
• بررسی اتریبیوت data-hide-for و کاربرد آن
• بررسی کلاس menu icon
• بررسی اتریبیوت data-responsive-menu
• نحوه کنترل نحوه نمایش و تغییر حالت منوها از حالت افقی به عمودی
• نحوه شرطی سازی منو برای نمایش متفاوت لینک های منون در حالت رسپانسو م صفحه نمایش های کوچک (مدیا کوئری small)
• کنترل تغییر کلاس های منو در مدیا کوئری مورد نظر توسط کدنویسی جاوااسکریپ اختصاصی برای منو در حالت رسپانسیو
• بررسی شی window و متد resize و دستورات شرطی جاوااسکریپ برای کنترل عرض مرورگر برای اعمال و یا حدف کلاس های مورد نظر به منو و مشاهده تعامل جاوااسکریپ با فریم ورک فاندیشن

دانلود فایل های جلسه سیزدهم

در این جلسه از دوره آموزشی سئو ما به بهینه سازی سرعت لود سایت میپردازیم که هم دارای مباحث تئوری هست و هم مباحث عملی که یک سایت رو میایم از لحاظ سرعت لود بهینه سازی میکنیم. مطالب مطرح شده در این جلسه عبارتند از :

• مفهوم کاربردپذیری در طراحی وب
• تاثیر هاست و مکان سرور بر سئو
• مزیت استفاده از Css3 بجای تصاویر
• آشنایی و نحوه استفاده از آیکون فونت ها
• آشنایی با چند تگ مهم در html5 و تاثیر آن بر سئو
• و...

توضیحات : Seo مخفف Search Engine Optimization به معنای بهینه سازی سایت برای موتور های جستجو می باشد. با توجه به درخواست های بالای کاربران ، مبنی بر برگزاری دوره سئو و همچنین نیاز به برگزاری یک دوره جامع برای آشنایی بیشتر وبمستران با بحث سئو ، برآن شدیم که یکی از دوره های سایت سون لرن را به مبحث SEO اختصاص دهیم. شما اگر بهترین برنامه نویس ، بهترین طراح رابط کاربری باشید و یا به طور کلی صاحب بهترین سایت هم که باشید ، تا زمانی که با بحث SEO آشنایی نداشته باشید نمیتوانید در سطح اینترنت خدمات ، کالا یا ... را به مخاطبانتان معرفی کنید یا به فروش برسانید. بنابرین سئو یک مبحث ضروری برای تمامی وبمستران و طراحان وب سایت می باشد که بایستی با آن آشنایی داشته باشند. متاسفانه بسیاری از طراحان وب و وبمسترها باورهای اشتباهی در رابطه با سئو دارند که باعث میشود این مبحث را یک چیز ساده یا برعکس یه چیز خیلی پیچیده بدانند. آیا میزان سئوی وب سایت خودتان رو براساس ابزار های آنالیز سئو تشخیص میدهید؟ آیا سئوی سایت خود را در طراحی قالب سایت خود می بینید؟ آیا سئوی سایت را در قرار دادن لینک خود در سایت های دیگر می بینید ؟ آیا سئو سایت را در نصب افزونه های موجود برای CMS های خود میدانید؟ بسیاری از سوالات این چنینی ممکن است ذهن شما را درگیر کرده باشد! در این دوره شما با پاسخ این سوالات و نحوه برخورد صحیح با آن ها آشنا خواهید شد. باید بدانید که سئو محدود به یک زمینه خاص نیست ، سئو ؛ ترکیبی از علم ، هنر و خلاقیت است. ما در این دوره سعی می کنیم به صورت جامع شما را با مفاهیم سئو به دور از اغراق و کاملا صادقانه آشنا کنیم تا خودتان بهینه ساز سایت خودتان باشید. امید است این دوره نیز برای شما دوستان گرامی مفید واقع گردد.

به نام خدا و سلام. در جلسه هفتم از دوره مجازی آموزش پلاگین نویسی وردپرس در خدمت شما هستیم. در این جلسه قصد داریم پلاگین فیلتر کردن محتوای نظرات وردپرس رو با هم دیگه بنویسیم. در ابتدای کار یک فایل ایجاد می کنیم و کلماتی که قصد داریم آنها در محتوای نظرات فیلتر کنیم وارد می کنیم. به صورت هر کلمه یک خط در فایل. سپس با تابع file محتوای فایل را می خوانیم و در یک آرایه قرار میدهیم و سپس طبق جلسه قبلی با filter های مناسب محتوای نظر را فیلتر می کنیم. در این جلسه با filter وردپرس comment_text آشنا خواهید شد. در این جلسه خواهیم دید :

• ایجاد فایل برای کلمات فیلتر
• ایجاد filter comment_text
• ایجاد تابع مورد نظر برای اجرای filter
• بررسی نحوه عملکرد filter

توضیحات : وردپرس به عنوان محبوب ترین سیستم مدیریت محتوا در بین اکثر کاربران فضای مجازی به خوبی شناخته شده است و این موضوع باعث شده تا سیستم های مختلفی برای وردپرس تهیه و به بازار عرضه شود. هر چند وردپرس خود رایگان است اما قابلیت های توسعه آن از جمله قالب ها و پلاگین ها که به کاربران کمک می کند سیستم مورد نظر خود را پیاده سازی کنند، باعث شده است تا رونق بسیار زیادی در بازار فروش قالب ها و پلاگین های آن ایجاد شود. فروش هایی که تا دهها میلیون دلار هم برای یک افزونه می رسد! در این دوره سعی کرده ایم تمامی مواردی که شما برای تهیه یک پلاگین عالی و کاملا حرفه ای نیاز دارد را قرار دهیم و تدریس نماییم. آموزش ها به صورت کاملا پروژه محور و کاربردی تهیه شده است، پلاگین هایی حرفه ای که هم نحوه ایجاد و کدنویسی آنها را یاد خواهید گرفت و هم آنها را در پایان دوره خواهید داشت. شما پس از گذراندن این دوره قادر خواهید بود هر نوع پلاگین دلخواه دیگری را که فکر می کنید برای سایت خود بنویسید. لازم به ذکر است در صورت سفارش پلاگین های طراحی و کدنویسی شده در این دوره، باید هزینه ای حداقل 800 هزارتومانی بپردازید! در صورتی که در این دوره شما فقط با پرداخت هزینه ای اندک، هم پلاگین نویسی حرفه ای خواهید شد و هم این پلاگین ها را در پایان دوره خواهید داشت. تدریس مباحث این دوره نیز به مانند دوره های دیگر سون لرن، بر اساس اصل صداقت در تدریس و جامع بودن دوره هاست و مدرس تمامی تجربیات حرفه ای خود در این زمینه را به شما انتقال خواهد داد! به جرئت می توانیم ادعا کنیم دوره حاضر حرفه ای ترین و استانداردترین دوره پلاگین نویسی وردپرس است که در سطح ایران برگزار می گردد. پس فرصت را از دست ندهید و خود را به یک پلاگین نویس حرفه ای وردپرس تبدیل کنید!

در این مطلب میخوام سایتی رو بهتون معرفی کنم که در اون آموزش داده شده که چطور با استفاده از CSS و jQuery یک Slideshow و Presentation زیبا رو طراحی کنید. این کد بر روی IE9 به بالا پشتیبانی میشه.

برای شروع وارد سایت presentation-slideshow بشین.

امیدوارم بدردتون بخوره.

موفق باشید.

یا علی

در این قسمت میخوام یک کد ( Lock Screen ) جالب رو در اختیارتون بزارم.

همونطور که دیدید یک صفحه قفل یا Lock Screen قرار داد شده و با کشیدن طرح میتونین اون رو باز کنید.

بدلیل اینکه حجم کدها زیاد بود ، اونارو در انتهای همین مطلب قرار میدم که میتونین اونو دانلود کرده و استفاده کنید. امیدوارم لذت برده باشین.

موفق باشید.

یا علی

Source

در این قسمت میخوام یک کد ( fancy page transitions ) جالب رو در اختیارتون بزارم.

همونطور که دیدید یک اسلایدر بسیار زیبا و پیشرفته قرار داده شده که با اسکرول کردن به سمت پایین و بالا جابجا میشن. اگر بر روی قسمت سمت چپ هم هاور کنید تمام اسلایدها باز میشه و میتونین هر کدوم رو خواستید انتخاب کنید.

بدلیل اینکه حجم کدها زیاد بود ، اونارو در انتهای همین مطلب قرار میدم که میتونین اونو دانلود کرده و استفاده کنید. امیدوارم لذت برده باشین.

موفق باشید.

یا علی

Source